// import React, { FC } from 'react';
// import { Select, Button, Card, Input } from 'antd'; // 引入 Input 组件
// import './index.css';

// const { Option } = Select;

// const SchoolInfoAudit: FC = () => {
//   const handleExport = () => {
//     console.log('导出数据');
//   };

//   const handleBack = () => {
//     console.log('返回');
//   };

//   const handleSave = () => {
//     console.log('保存并提交');
//   };

//   return (
//     <div>
//       <div
//         style={{
//           backgroundColor: 'white',
//           padding: '10px 20px',
//           borderRadius: '8px',
//           boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
//           marginBottom: '20px',
//           fontSize: '20px',
//           fontWeight: 'bold',
//         }}
//       >
//         资产管理
//       </div>
//       <Card
//         style={{
//           borderRadius: '8px',
//           boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
//         }}
//       >
//         <div className="slectr">
//           <div className="selectr" style={{ marginBottom: '20px' }}>
//             <Select defaultValue="选择年份" style={{ width: 200 }}>
//               <Option value="2024">2024</Option>
//               <Option value="2023">2023</Option>
//               <Option value="2022">2022</Option>
//               <Option value="2021">2021</Option>
//               <Option value="2020">2020</Option>
//               {/* 可以根据需要添加更多选项 */}
//             </Select>
//             <Button type="primary" onClick={handleExport}>
//               导出
//             </Button>
//           </div>
//           <div className="ytitle">
//             <h4>园所名称：xxx第一幼儿园</h4>
//           </div>
//           <div className="menu">
//             <div className="tent">
//               <h4>资产情况</h4>
//               <div style={{ display: 'flex', flexWrap: 'wrap' }}>
//                 <div style={{ width: '50%', padding: '10px' }}>
//                   <label>
//                     占地面积(m2)：
//                     <Input placeholder="请输入" />
//                   </label>
//                 </div>
//                 <div style={{ width: '50%', padding: '10px' }}>
//                   <label>
//                     绿化用地面积(m2)：
//                     <Input placeholder="请输入" />
//                   </label>
//                 </div>
//                 <div style={{ width: '50%', padding: '10px' }}>
//                   <label>
//                     室外游戏场地(m2)：
//                     <Input placeholder="请输入" />
//                   </label>
//                 </div>
//                 <div style={{ width: '50%', padding: '10px' }}>
//                   <label>
//                     图书(测)：
//                     <Input placeholder="请输入" />
//                   </label>
//                 </div>
//                 <div style={{ width: '50%', padding: '10px' }}>
//                   <label>
//                     固定资产总值(万元)：
//                     <Input placeholder="请输入" />
//                   </label>
//                 </div>
//                 <div style={{ width: '50%', padding: '10px' }}>
//                   <label>
//                     玩教具资产值(万元)：
//                     <Input placeholder="请输入" />
//                   </label>
//                 </div>
//               </div>
//             </div>
//             <div className="bot" style={{ marginTop: '20px', display: 'flex', justifyContent: 'space-between' }}>
//               <Button type="default" onClick={handleBack} style={{ backgroundColor: 'white' }}>
//                 返回
//               </Button>
//               <Button type="primary" onClick={handleSave}>
//                 保存并提交
//               </Button>
//             </div>
//           </div>
//         </div>
//       </Card>
//     </div>
//   );
// };

// export default SchoolInfoAudit;

import React, { FC } from 'react';
import { Card, Input, Typography, Select, Row, Col, Button, Table } from 'antd';

const { Text } = Typography;
const { Option } = Select;

const SchoolInfoAudit: FC = () => {
  // 表格数据示例
  const dataSource = [
    {
      key: '1',
      organizationName: '示例园所A',
      organizationId: 'ORG001',
      jurisdiction: '北京',
      schoolIdentifier: 'ID001',
      starLevel: '一星',
      educationLevel: '小学',
    },
    {
      key: '2',
      organizationName: '示例园所B',
      organizationId: 'ORG002',
      jurisdiction: '上海',
      schoolIdentifier: 'ID002',
      starLevel: '二星',
      educationLevel: '初中',
    },
    {
      key: '3',
      organizationName: '示例园所C',
      organizationId: 'ORG003',
      jurisdiction: '广州',
      schoolIdentifier: 'ID003',
      starLevel: '三星',
      educationLevel: '高中',
    },
  ];

  // 表头配置
  const columns = [
    {
      title: '编号',
      dataIndex: 'key',
      key: 'key',
    },
    {
      title: '园所名称(规划路径)',
      dataIndex: 'organizationName',
      key: 'organizationName',
    },
    {
      title: '园所名称',
      dataIndex: 'organizationName', // 这里可以替换为一个不同的字段，示例中暂时相同
      key: 'organizationNameDuplicate',
    },
    {
      title: '机构编码',
      dataIndex: 'organizationId',
      key: 'organizationId',
    },
    {
      title: '行政归属地',
      dataIndex: 'jurisdiction',
      key: 'jurisdiction',
    },
    {
      title: '学校(机构)标识码',
      dataIndex: 'schoolIdentifier',
      key: 'schoolIdentifier',
    },
    {
      title: '园所星级',
      dataIndex: 'starLevel',
      key: 'starLevel',
    },
    {
      title: '教育层',
      dataIndex: 'educationLevel',
      key: 'educationLevel',
    },
    {
      title: '操作',
      key: 'action',
      render: () => (
        <span>
          <Button type="link">查看</Button>
          <Button type="link">删除</Button>
        </span>
      ),
    },
  ];

  return (
    <div>
      <div
        style={{
          backgroundColor: 'white',
          padding: '10px 20px',
          borderRadius: '8px',
          boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
          marginBottom: '20px',
          fontSize: '20px',
          fontWeight: 'bold',
        }}
      >
        资产管理
      </div>
      <Card
        style={{
          borderRadius: '8px',
          boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
        }}
      >
        <div
          className="selectr"
          style={{ marginBottom: '20px', display: 'flex', justifyContent: 'space-between', flexWrap: 'wrap' }}
        >
          <div style={{ display: 'flex', alignItems: 'center', marginBottom: '10px' }}>
            <span style={{ marginRight: '10px' }}>园所名称(规划口径)</span>
            <Input placeholder="请输入园所名称" style={{ width: '200px' }} />
          </div>
          <div style={{ display: 'flex', alignItems: 'center', marginBottom: '10px' }}>
            <span style={{ marginRight: '10px' }}>园所名称</span>
            <Input placeholder="请输入园所名称" style={{ width: '200px' }} />
          </div>
          <div style={{ display: 'flex', alignItems: 'center', marginBottom: '10px' }}>
            <span style={{ marginRight: '10px' }}>行政管辖区</span>
            <Select placeholder="请输入园所名称" style={{ width: '200px' }}>
              <Select.Option value="beijing">北京</Select.Option>
              <Select.Option value="shanghai">上海</Select.Option>
              <Select.Option value="guangzhou">广州</Select.Option>
            </Select>
            <Select placeholder="请选择行政归属地" style={{ width: '200px' }}>
              <Select.Option value="beijing">北京</Select.Option>
              <Select.Option value="shanghai">上海</Select.Option>
              <Select.Option value="guangzhou">广州</Select.Option>
            </Select>
            <Select placeholder="请选择行政归属地" style={{ width: '200px' }}>
              <Select.Option value="beijing">北京</Select.Option>
              <Select.Option value="shanghai">上海</Select.Option>
              <Select.Option value="guangzhou">广州</Select.Option>
            </Select>
          </div>

          {/* 添加三个按钮 */}
          <div style={{ display: 'flex', justifyContent: 'space-between', width: '100%', marginTop: '20px' }}>
            <Button type="primary">导出</Button>
            <div style={{ display: 'flex', gap: '10px' }}>
              <Button>查询</Button>
              <Button>重置</Button>
            </div>
          </div>
        </div>

        {/* 添加表格 */}
        <div style={{ marginTop: '20px' }}>
          <Table dataSource={dataSource} columns={columns} pagination={false} />
        </div>
      </Card>
    </div>
  );
};

export default SchoolInfoAudit;
